<template>
  <div>
    <el-row>
      <el-button type="primary" size="mini" @click="onSaveHTML">保存</el-button>
    </el-row>
    <div style="height: 10px"></div>
    <TEditor ref="myEditor"> </TEditor>
  </div>
</template>
<script lang="ts">
import TFormBase from "@/views/BaseForm";
import TEditor from "@/components/tinymceEditor.vue";
import { Options } from "vue-class-component";
import { TBaseCmsMenu } from "@/baselib/module/cms/BaseCmsApi";
//配合着用
@Options({
  name: "TFormCmsEditor",
  components: {
    TEditor,
  },
  computed: {},
  data() {},
})
export default class TFormCmsEditor extends TFormBase {
  declare $refs: {
    myEditor: TEditor;
  };
  private FFileID: string = "";
  private FCmsID: string = "";
  private FCmsMenuID: string = "";
  private FCmsQuestionID: string = "";
  public created() {
    if (this.zIndexTag?.menuParams.CmsID) {
      this.FCmsID = this.zIndexTag?.menuParams.CmsID;
    }
    if (this.zIndexTag?.menuParams.CmsMenuID) {
      this.FCmsMenuID = this.zIndexTag?.menuParams.CmsMenuID;
      this.FFileID = this.FCmsMenuID;
    }
    if (this.zIndexTag?.menuParams.CmsQuestionID) {
      this.FCmsQuestionID = this.zIndexTag?.menuParams.CmsQuestionID;
      this.FFileID = this.FCmsQuestionID;
    }
    this.openData();
  }
  public mounted() {
    //绑定富文本上传事件
    this.$refs.myEditor.upload_handler = this.onUpload;
  }
  private async openData() {
    if (!this.$myStrHelper.stringIsEmptyYW(this.FFileID)) {
      let lResult = await this.$myBaseCms.GetCmsHTMLContent(this.FFileID);
      if (!lResult.resultSuccess) {
        this.$myMsgHelp.msgDialog(lResult.resultMsg);
        return;
      }
      this.$refs.myEditor.SetHtmlContent(lResult.resultData);
    }
  }
  private async onUpload(blobInfo: any, succFun: any, failFun: any) {
    var lFile = blobInfo.blob() as Blob; //转化为易于理解的file对象
    let lFormData: FormData = new FormData();
    lFormData.append("CmsID", this.FCmsID);
    lFormData.append("MenuID", this.FCmsMenuID);
    lFormData.append("QuestionID", this.FCmsQuestionID);
    lFormData.append("file", lFile);
    let lResult = await this.$myBaseCms.PostFile(lFormData);
    if (!lResult.resultSuccess) {
      failFun(lResult.resultMsg);
      return;
    }
    var lUrl = this.$myGlobal.urlCombination(
      "/CmsHelper/BrowserFile/" + lResult.resultData
    );
    succFun(lUrl);
  }
  private async onSaveHTML() {
    let lHtmlContent = this.$refs.myEditor.GetHtmlContent();
    var lBlob = new Blob([lHtmlContent], {
      type: "text/plain",
    });
    let lFormData: FormData = new FormData();
    lFormData.append("CmsID", this.FCmsID);
    lFormData.append("MenuID", this.FCmsMenuID);
    lFormData.append("QuestionID", this.FCmsQuestionID);
    lFormData.append("FileID", this.FFileID); //指定文件名存在覆盖
    lFormData.append("file", lBlob);
    let lResult = await this.$myBaseCms.PostFile(lFormData);
    if (!lResult.resultSuccess) {
      return;
    }
    this.$myMsgHelp.msgHintAutoClose("保存富文本成功");
  }
}
</script>